<template>
    <view class="box">
        <view class="record" v-for="item in list" :key="item.utime">
            <!-- header s -->
            <view class="header">
                <view class="text1">{{item.ctime | date}}</view>
                <text class="text2">{{item.type}}</text>
            </view>
            <!-- header e -->
            <!-- footer s -->
            <view class="footer">
                <view class="imgtext">
                    <!-- <view> -->
                        <!-- <image class="img1" :src="i.image_url"></image> -->
                        <!-- <text>用户: {{item.username}}</text> -->
                    <!-- </view> -->
                    <!-- <view> -->
                        <!-- <br> -->
                        <text>积分: {{item.num}}</text>
                        <br>
                        <text>余额: {{item.balance}}</text>
                        <br>
                        <text>备注: {{item.remarks}}</text>
                    <!-- </view> -->
                </view>
                
                <!-- <view>
                    <image class="img2" src="../../static/img/myhome/fc-delete@3x.png"></image>
                </view> -->
            </view>
            <!-- footer e -->
        </view>
        <u-loadmore
            :status="status" 
            :load-text="loadText" />
    </view>
</template>

<script>
    export default {
        data() {
            return {
                list: [],
                params: {
                    page: 1,
                    limit: 20,
                    status: 6,
                },
                status: 'loading',
                loadText: {
                    loadmore: '上拉加载更多',
                    loading: '加载中...',
                    nomore: '没有更多数据了'
                },
                olPage: 1,
            };
        },
        mounted() {
            this._getUserPoint();
        },
        onReachBottom() {
            this.params.page++;
            this._getHsAmount();
        },
        methods: {
            // 商城订单列表api
            _getUserPoint() {
                // uni.showLoading({
                //     title: '加载中'
                // });
                this.status = 'loading';
                this.$u.api.getUserPoint(this.params).then(res => {
                    // this.list = res.list
                    // uni.hideLoading();
                    if(this.params.page == 1) {
                        this.status = 'nomore';
                        this.list = res;
                    } else {
                        if(res <= 0) {
                            this.status = 'nomore';
                            this.params.page = this.olPage;
                            return ;
                        }
                        this.olPage = this.params.page;
                        this.list = this.list.concat(res);
                    }
                }).catch(err => {
                    // uni.hideLoading();
                })
            },
        }
    }
</script>

<style lang="scss" scoped>
    .box {
        background-color: #EEEEEE;
        min-height: 100vh;
        padding: 30rpx;
    }

    .record {
        margin-bottom: 30rpx;
        padding: 0 30rpx;
        // height: 248rpx;
        background-color: #ffffff;
        border-radius: 20rpx;
    }

    .header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 98rpx;
        border-bottom: 1px solid #EEEEEE;

        .text1 {
            font-size: 28rpx;
            color: #191919;
        }

        .text2 {
            font-size: 36rpx;
            color: #1bc078;
        }
    }

    .footer {
        // display: flex;
        // justify-content: space-between;
        // align-items: center;
        font-size: 24rpx;
        color: #999999;
        // height: 150rpx;

        .imgtext {
            display: flex;
            align-items: center;
            padding: 20rpx 0;
            .img1 {
                margin-right: 30rpx;
                width: 90rpx;
                height: 90rpx;
                border-radius: 10rpx;
            }
            text {
                flex: 1;
            }
        }

        .img2 {
            width: 50rpx;
            height: 50rpx;
        }
    }
</style>
